// 导入Vue
import Vue from 'vue'
// 导入路由
import VueRouter from 'vue-router'

// 导入一个页面组件
import HomeView from '../views/HomeView.vue'

// 安装路由 -- 这个路由是专门给Vue用的，所以给Vue安装一下
Vue.use(VueRouter)

// 设置路由规则
// 这里所谓的规则就是设置 什么路径对应什么组件
const routes = [
  {
    // 路径
    path: '/home',
    // 给这个路由起一个名字
    name: 'home',
    // 组件
    component: HomeView
  },
  {
    path: '/about',
    name: 'about',
    // 这里是用另外一种方式导入组件，导入了AboutView
    // 所以这里的规则相当于用 `/about` 这个路径会切换到 `AboutView`这个组件
    component: () => import('../views/AboutView.vue')
  }
]

// 实例化路由对象，并设置它的规则
const router = new VueRouter({
  routes,
  // mode: 'history'
})


// 默认导出这个路由对象
export default router
